


import 'dart:io';

import 'package:file_picker/file_picker.dart';
import 'package:flutter/cupertino.dart';
import 'package:flutter/material.dart';
import 'package:flutter_trip_demo/pages/travel_photo_tab_page.dart';

import '../dao/travel_photo_tab_dao.dart';
import '../model/travel_photo_tab_model.dart';
import '../picture_filter/image_filter_selection.dart';
import '../utils/navigator/navigator_util.dart';
import '../video_clip_editor/clipper_view.dart';

///旅拍模块
//修改之前所有旅拍数据 stetelesswidget改用StatefulWidget
class TravelPhotoPage extends StatefulWidget {
  const TravelPhotoPage({Key? key}) : super(key: key);

  @override
  _TravelPhotoPageState createState() => _TravelPhotoPageState();
}

class _TravelPhotoPageState extends State<TravelPhotoPage> with TickerProviderStateMixin{
  //存放数据
  late TabController _controller;
  List<TravelTab> traveltabs=[];
  late TravelPhotoTabModel travelTabModel;

  //进行数据初始化
  @override
  void initState() {
    _controller=TabController(length: 0, vsync: this);
    TravelPhotoTabDao.fetch().then((TravelPhotoTabModel model){
      _controller=TabController(length: model.tabs.length, vsync: this);
      setState(() {
        traveltabs=model.tabs;
        travelTabModel=model;
      });
    }).catchError((e) {
      print(e);
    });
    super.initState();
  }

  //进行销毁以防泄露
  @override
  void dispose() {
    _controller.dispose();
    super.dispose();
  }

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      body: Column(
        children: <Widget>[
          Container(
            color: Colors.white,
            padding: const EdgeInsets.only(top: 30),
            //设置顶部导航栏
            child: TabBar(
              controller: _controller,
              isScrollable: true,
              labelColor: Colors.black,
              labelPadding: const EdgeInsets.fromLTRB(20, 0, 10, 5),
              indicator: const UnderlineTabIndicator(
                  borderSide: BorderSide(color: Color(0xff2fcfbb),width: 3),
                  insets: EdgeInsets.only(bottom: 10)
              ),
              tabs: traveltabs.map<Tab>((TravelTab tab) {
                return Tab(text: tab.labelName,);
              }).toList(),
            ),
          ),
          //设置下方主要显示widget
          Flexible(
              child: TabBarView(
                  controller: _controller,
                  children: traveltabs.map((TravelTab tab){
                    return TravelTabPage(
                      travelUrl: travelTabModel.url,
                      params: travelTabModel.params,
                      groupChannelCode: tab.groupChannelCode,
                    );
                  }).toList()))
        ],
      ),
      //悬浮按钮
      floatingActionButton: FloatingActionButton(
        onPressed: (){//按压
          showModalBottomSheet(//展示模态底板--类似于AndroidStudio的popupWidow弹窗
            context: context,
            backgroundColor: Colors.white,//背景色
            shape: const RoundedRectangleBorder(//设置样式--圆角矩形边界
              borderRadius: BorderRadius.only(//左上、右上圆角
                topLeft: Radius.circular(15.0),
                topRight: Radius.circular(15.0),
              )
            ),
            builder: (context){
              return SizedBox(
                height: 260,//高度
                child: Column(
                  children: [
                    //相同的布局样式,所以封装了一个方法来减少代码量
                    //_showSheetItem(title),参数：一个字符串标题
                    _showSheetItem(
                      '照片滤镜',
                    ),
                    _showSheetItem(
                      '视频拍摄',
                    ),
                    _showSheetItem(
                      '视频剪辑',
                    ),
                  ],
                ),
              );
            }
          );
        },
        child: const Icon(CupertinoIcons.add_circled,color: Colors.white,),
      ),
    );
  }

  //模型板每个item--类似于AndroidStudio的popupWidow弹窗的每个item
  _showSheetItem(String title){
    return Container(
      height: 80,
      width: 750,
      decoration: const BoxDecoration(//盒子装饰器
        border: Border(//底部边框-灰色
          bottom: BorderSide(width: 1.0,color: Colors.black12),
        ),
      ),
      child: InkWell(//可以点击的控件
        onTap: () {//点击事件--根据title进行不同效果
          if(title.contains('滤镜')){
            goPop();
            goImageFilterSelection();
          } else if(title.contains('剪辑')){
            goPop();
            goVideoClip();
          } else {
            print('功能待完善……');
            goPop();
          }
        },
        child: Center(
          child: Text(
            title,
            style: const TextStyle(
                fontSize: 20,
                fontWeight: FontWeight.w300
            ),
          ),
        ),
      ),
    );
  }

  //跳转图片滤镜页面
  void goImageFilterSelection(){
    //先跳出、再跳入
    NavigatorUtil.push(context, const ImageFilterSelection());
  }
  //跳出页面
  void goPop(){
    Navigator.pop(context);
  }

  Future<void> goVideoClip() async {
    FilePickerResult? result =
        await FilePicker.platform.pickFiles(
      type: FileType.video,
      allowCompression: false,
    );
    if (result != null) {
      File file = File(result.files.single.path!);
      Navigator.of(context).push(
        MaterialPageRoute(builder: (context) {
          return ClipperView(file);
        }),
      );
    }

  }

}

